<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <link rel="shortcut icon" href="favicon.ico" >
    <link href='http://fonts.googleapis.com/css?family=Yanone+Kaffeesatz:400,700,300&subset=latin,latin-ext' rel='stylesheet' type='text/css'>
    <link href='http://fonts.googleapis.com/css?family=Droid+Serif:400,700' rel='stylesheet' type='text/css'>
    <link href='http://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,700,600,800&subset=latin,cyrillic' rel='stylesheet' type='text/css'>
    <link rel="stylesheet" href="js/jqwidgets/styles/jqx.base.css" type="text/css" />
    <link rel="stylesheet" href="js/jqwidgets/styles/jqx.xpence.css" type="text/css" />
    <link rel="stylesheet" href="css/tooltipster.css" type="text/css" />
    <link rel="stylesheet" href="css/tooltipster-light.css" type="text/css" />
    <link rel="stylesheet" href="css/apprise-v2.css" type="text/css" />
    <link rel="stylesheet" href="css/xpence.css" type="text/css" />
    <script type="text/javascript" src="js/jquery/jquery-1.11.0.js"></script>
    <script type="text/javascript" src="js/jquery/jquery.cookie.js"></script>
    <script type="text/javascript" src="js/jquery/jquery.tooltipster.min.js"></script>
    <script type="text/javascript" src="js/jquery/jquery.autosize.min.js"></script>
    <script type="text/javascript" src="js/jquery/apprise-v2.js"></script>
    <script type="text/javascript" src="js/knockout/knockout-3.1.0.js"></script>
    <script type="text/javascript" src="js/momentjs/moment.min.js"></script>
    <script type="text/javascript" src="js/jqwidgets/jqxcore.js"></script>
    <script type="text/javascript" src="js/jqwidgets/jqxdata.js"></script>
    <script type="text/javascript" src="js/jqwidgets/jqxbuttons.js"></script>
    <script type="text/javascript" src="js/jqwidgets/jqxscrollbar.js"></script>
    <script type="text/javascript" src="js/jqwidgets/jqxmenu.js"></script>
    <script type="text/javascript" src="js/jqwidgets/jqxgrid.js"></script>
    <script type="text/javascript" src="js/jqwidgets/jqxgrid.aggregates.js"></script>
    <script type="text/javascript" src="js/jqwidgets/jqxgrid.selection.js"></script>
    <script type="text/javascript" src="js/jqwidgets/jqxgrid.edit.js"></script>
    <script type="text/javascript" src="js/jqwidgets/jqxgrid.pager.js"></script>
    <script type="text/javascript" src="js/jqwidgets/jqxdropdownlist.js"></script>
    <script type="text/javascript" src="js/jqwidgets/jqxdropdownbutton.js"></script>
    <script type="text/javascript" src="js/jqwidgets/jqxcombobox.js"></script>
    <script type="text/javascript" src="js/jqwidgets/jqxlistbox.js"></script>
    <script type="text/javascript" src="js/jqwidgets/jqxtree.js"></script>
    <script type="text/javascript" src="js/jqwidgets/jqxdragdrop.js"></script>
    <script type="text/javascript" src="js/jqwidgets/jqxknockout.js"></script>
    <script type="text/javascript" src="js/jqwidgets/jqxcheckbox.js"></script>
    <script type="text/javascript" src="js/jqwidgets/jqxdatetimeinput.js"></script>
    <script type="text/javascript" src="js/jqwidgets/jqxcalendar.js"></script>
    <script type="text/javascript" src="js/jqwidgets/jqxtooltip.js"></script>
    <script type="text/javascript" src="js/jqwidgets/jqxtabs.js"></script>
    <script type="text/javascript" src="js/jqwidgets/jqxpanel.js"></script>
    <script type="text/javascript" src="js/jqwidgets/jqxdockpanel.js"></script>
    <script type="text/javascript" src="js/jqwidgets/jqxexpander.js"></script>
    <script type="text/javascript" src="js/jqwidgets/jqxrangeselector.js"></script>
    <script type="text/javascript" src="js/jqwidgets/jqxdata.js"></script>
    <script type="text/javascript" src="js/jqwidgets/jqxinput.js"></script>
    <script type="text/javascript" src="js/jqwidgets/jqxnumberinput.js"></script>
    <script type="text/javascript" src="js/jqwidgets/jqxwindow.js"></script>

    <script type="text/javascript" src="js/app/model/Unique.js"></script>
    <script type="text/javascript" src="js/app/controller/Cache.js"></script>
    <script type="text/javascript" src="js/app/model/book.js"></script>
    <script type="text/javascript" src="js/app/controller/AuthController.js"></script>
    <script type="text/javascript" src="js/app/view/LoginView.js"></script>
    <script type="text/javascript" src="js/app/view/UserView.js"></script>
    <script type="text/javascript" src="js/app/controller/BooksManager.js"></script>
    <script type="text/javascript" src="js/app/controller/AccountManager.js"></script>
    <script type="text/javascript" src="js/app/controller/TrManager.js"></script>
    <script type="text/javascript" src="js/app/controller/ReportController.js"></script>
    <script type="text/javascript" src="js/app/view/NotificationView.js"></script>
    <script type="text/javascript" src="js/app/view/ErrorView.js"></script>
    <script type="text/javascript" src="js/app/view/InputDialog.js"></script>
    <script type="text/javascript" src="js/app/model/Currency.js"></script>
    <script type="text/javascript" src="js/app/controller/CurrencyManager.js"></script>
    <script type="text/javascript" src="js/app/model/Category.js"></script>
    <script type="text/javascript" src="js/app/controller/CategoryManager.js"></script>
    <script type="text/javascript" src="js/app/view/CategoryManagerView.js"></script>
    <script type="text/javascript" src="js/app/view/ComboView.js"></script>
    <script type="text/javascript" src="js/app/view/ListView.js"></script>
    <script type="text/javascript" src="js/app/model/Account.js"></script>
    <script type="text/javascript" src="js/app/view/AccountsView.js"></script>
    <script type="text/javascript" src="js/app/view/AccountView.js"></script>
    <script type="text/javascript" src="js/app/controller/AccountManager.js"></script>
    <script type="text/javascript" src="js/app/controller/TrManager.js"></script>
    <script type="text/javascript" src="js/app/model/Transaction.js"></script>
    <script type="text/javascript" src="js/app/view/TrTableView.js"></script>
    <script type="text/javascript" src="js/app/view/TrView.js"></script>
    <script type="text/javascript" src="js/app/model/TrFilter.js"></script>
    <script type="text/javascript" src="js/app/view/TrFilterView.js"></script>
    <script type="text/javascript" src="js/app/model/AccountsFilter.js"></script>
    <script type="text/javascript" src="js/app/view/AccountsFilterView.js"></script>
    <script type="text/javascript" src="js/app/view/Pager.js"></script>
    <script type="text/javascript" src="js/app/model/TagsFilter.js"></script>
    <script type="text/javascript" src="js/app/model/Tag.js"></script>
    <script type="text/javascript" src="js/app/controller/TagManager.js"></script>
    <script type="text/javascript" src="js/app/view/TagsFilterView.js"></script>
    <script type="text/javascript" src="js/app/model/DateFilter.js"></script>
    <script type="text/javascript" src="js/app/model/BoolFilter.js"></script>
    <script type="text/javascript" src="js/app/model/CategoriesFilter.js"></script>
    <script type="text/javascript" src="js/app/view/CategoriesFilterView.js"></script>
    <script type="text/javascript" src="js/app/view/TreeComboView.js"></script>
    <script type="text/javascript" src="js/app/model/Sorting.js"></script>
    <!--<script type="text/javascript" src="js/app/"></script>-->

    <script type="text/javascript" src="js/app/Application.js"></script>
    <script type="text/javascript" src="js/app/common/jsUtils.js"></script>
    <script type="text/javascript" src="js/app/common/uiUtils.js"></script>

    <script type="text/javascript">
        $(document).ready(function () {
            // fix width and height of modal window
            // http://www.jqwidgets.com/community/topic/jumpy-scroll-bar-on-the-main-window-with-ismodal-enabled/
//            $('.jqx-window-modal').css('height', $(window).height());
//            $('.jqx-window-modal').css('width', $(window).width());
            document.body.scroll = "no";
            document.body.style.overflow = 'hidden';
            document.height = window.innerHeight;

            $(window).resize(function() {
                if(this.resizeTO) clearTimeout(this.resizeTO);
                this.resizeTO = setTimeout(function() {
                    $(this).trigger('resizeEnd');
                }, 200);
            });

            $('.tooltip').tooltipster();

            (function($) {

                var o = $({});

                $.subscribe = function() {
                    o.on.apply(o, arguments);
                };

                $.subscribeOne = function() {
                    o.one.apply(o, arguments);
                };

                $.unsubscribe = function() {
                    o.off.apply(o, arguments);
                };

                $.publish = function() {
                    o.trigger.apply(o, arguments);
                };

            }(jQuery));

            var app = new Application();
            app.init();
        });
    </script>
    <title>Xpence</title>
</head>
<body class='default body main-background'>
    <table width="100%" class="central-widget">
        <thead>
            <tr class="header">
                <td width="30%" align="left">
                    <a href="index.html" class="logo-main">Xpence</a>
                </td>
                <td width="40%" align="center">
                    <div id="notification" class="notification"></div>
                </td>
                <td width="30%" align="right">
                    <div id="userInfo" style="text-align: right;"></div>
                </td>
            </tr>
        </thead>
        <tfoot>
        <tr class="footer">
            <td colspan="3">
                Snup & Brova © 2014
            </td>
        </tr>
        </tfoot>
        <tbody>
            <tr>
                <td><div id="errorPanel"></div></td>
            </tr>
            <tr class="mainContent">
                <td colspan="3" align="center">
                    <div id="mainPanel">

                        <ul>
                            <li><div class="tab-main">
                                <div style="float: left;"><img width="16" height="16" src="images/book_yellow.png"/></div>
                                <div id="bookTab" style="margin-left: 4px; vertical-align: middle; text-align: center; float: left;">Книга</div>
                            </div></li>
                            <li><div class="tab-main">
                                <div style="float: left;"><img width="16" height="16" src="images/money2.png"/></div>
                                <div style="margin-left: 4px; vertical-align: middle; text-align: center; float: left;">Счета</div>
                                </div></li>
                            <li><div class="tab-main">
                                <div style="float: left;"><img width="16" height="16" src="images/line-chart.png"/></div>
                                <div style="margin-left: 4px; vertical-align: middle; text-align: center; float: left;">Транзакции</div>
                                </div></li>
                            <li><div class="tab-main">
                                <div style="float: left;"><img width="16" height="16" src="images/pie-chart.png"/></div>
                                <div style="margin-left: 4px; vertical-align: middle; text-align: center; float: left;">Отчеты</div>
                                </div></li>
                        </ul>
                        <div class="central-widget">
                            <table class="table-layout"><tr>
                                <td class="table-layout-cell"><div id="books"></div></td>
                                <td class="table-layout-cell"><div id="categories"></div></td>
                                <td class="table-layout-cell"><div id="currencies"></div></td>
                            </tr></table>
                        </div>
                        <div id="accounts" class="central-widget">
                            <table align="center" class="table-layout">
                                <tr>
                                    <td>На дату:</td><td><div id="accountsDateFilter"></div></td>
                                    <td class="td-hspacer16"></td>
                                    <td><div id="accountsApprovedFilter">учитывать запланированные транзакции</div></td>
                                    <td class="td-hspacer16"></td>
                                    <td><input id="accountsRefreshBtn" type="button" value="Обновить" /></td>
                                    <td align="right"><input id="accountCreateBtn" type="button" value="Добавить счет" /></td></tr>
                                <tr>
                                    <td colspan="7"><div id="accountsTable"></div>
                                        <div id="accountsEditDialog"></div></td>
                                </tr>
                            </table>
                        </div>
                        <div id="transactions" class="central-widget">
                            <table align="left" class="grid">
                                <tr><td>
                                    <table class="vbox"><tr><td>
                                        <div id="trForm"></div>
                                    </td></tr><tr><td>
                                        <div id="trFilter" class="transactions-filter"></div>
                                    </td></tr></table>
                                </td><td class="top">
                                    <div id="trTable" class="data-table"></div>
                                </td></tr>
                                <!--<tr>-->
                                    <!--<td class="layout-base-cell"><div id="trTable" class="data-table"></div></td>-->
                                <!--</tr>-->
                            </table>
                        </div>
                        <div id="reports" class="central-widget">

                        </div>

<!--
                                    <div id="transactionsFilter" class="filter-transactions">
                                        <div>Фильтр транзакций</div>
                                        <div>
                                            <table class="transactions-filter">
                                                <tr class="hbox">
                                                    <td class="bar-left">
                                                        <table>
                                                            <tr><td><div id="trFilterApplyImmidiately" class="form-control">применять<br>немедленно</div></td></tr>
                                                            <tr><td><div id="trFilterApplyButton" class="form-control">Обновить</div></td></tr>
                                                        </table>
                                                    </td>
                                                    <td class="bar-right bar-left">
                                                        <table>
                                                            <tr><td><div id="trFilterIncomesCheckBox" class="form-control income">доходы</div></td></tr>
                                                            <tr><td><div id="trFilterOutcomesCheckBox" class="form-control outcome">расходы</div></td></tr>
                                                            <tr><td><div id="trFilterTransfersCheckBox" class="form-control transfer">переносы</div></td></tr>
                                                        </table>
                                                    </td>
                                                    <td class="bar-right bar-left">
                                                        <table>
                                                            <tr>
                                                                <td colspan="4"><div id="trFilterApprovedOnly" class="form-control">только утвержденные</div></td>
                                                            </tr><tr><td>с</td><td><div id="trFilterDateFrom"></div></td>
                                                                <td>по</td><td><div id="trFilterDateTo"></div></td>
                                                            </tr>



                                                        </table>
                                                    </td>
                                                    <td class="bar-right bar-left">
                                                        <table class="nospacing">
                                                            <tr>
                                                                <td colspan="2" class="field-label-top">со счета</td>
                                                                <td colspan="2" class="field-label-top">на счет</td>
                                                            </tr>
                                                            <tr>
                                                                <td><div id="trFilterSrcAccount" class="form-control"></div></td>
                                                                <td><div id="trFilterAccountsSwapBtn" class="form-control">&#x21C6;</div></td>
                                                                <td><div id="trFilterDstAccount" class="form-control"></div></td>
                                                                <td><div id="trFilterAccountsAddBtn" class="form-control">+</div></td>
                                                            </tr><tr><td colspan="4"><div id="trFilterAccounts"></div></td>
                                                        </tr>
                                                        </table>
                                                    </td>
                                                    <td class="bar-right bar-left">
                                                        <table class="nospacing">
                                                            <tr>
                                                                <td><div id="trFilterCategory" class="form-control">
                                                                    <div id="trFilterCategoryTree"></div>
                                                                </div></td>
                                                            </tr><tr><td><div id="trFilterCategories"></div></td>
                                                        </tr>
                                                        </table>
                                                    </td>
                                                    <td class="bar-right">
                                                        <div id="trFilterTags" class="form-control">Теги теги теги</div>
                                                    </td>
                                                </tr>
                                            </table>
                                        </div>
                                    </div>-->
                    </div>
                </td>
            </tr>
        </tbody>
    </table>
</body>
</html>
